<template>
	<section>
		<!--工具条-->
		<el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
			<el-form :inline="true" :model="filters">
				<el-form-item>
					<el-input v-model="filters.name" placeholder="姓名"></el-input>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" v-on:click="getReturnCar">查询</el-button>
				</el-form-item>
			</el-form>
		</el-col>
		<div>
		<!--列表-->
		<el-table :data="returnCar" highlight-current-row v-loading="listLoading" @selection-change="selsChange" style="width: 100%;" v-on:row-dblclick="getreturencar">
			<el-table-column type="index" width="60">
			</el-table-column>
			<el-table-column prop="id" label="结算编号" sortable align="center">
			</el-table-column>
			<el-table-column prop="custormer" label="客户姓名" sortable align="center">
			</el-table-column>
			<el-table-column prop="order_id" label="维修工单" sortable align="center">
			</el-table-column>
			<el-table-column prop="re_amount" label="应付金额" sortable align="center">
			</el-table-column>
			<el-table-column prop="pay_amount" label="实付金额" sortable align="center">
			</el-table-column>
			<el-table-column prop="address"  label="地址" sortable align="center">
			</el-table-column>
			<el-table-column prop="typeName.typeName" label="支付方式" sortable align="center">
			</el-table-column>
			<el-table-column prop="settedTime" label="结算时间" sortable align="center">
			</el-table-column>
			<el-table-column label="操作" width="150" align="center">
				<template scope="scope">
					<el-button style="background-color: orangered;color: white" size="small" @click="getreturencar()"   >还车操作</el-button>

				</template>
			</el-table-column>
		</el-table>
		<!--工具条-->
		<el-col :span="24" class="toolbar">

			<el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="10" :total="total" style="float:right;" >
			</el-pagination>
		</el-col>

		<el-dialog title="编辑" :visible.sync="returnCarMap">
			<template >

				<baidu-map >
					<bm-view class="map" >
					</bm-view>
					<bm-driving
								start="成都市高新区府城大道西段399号天府新谷1号楼6楼源码世代"
								v-bind:end=toWay
							:auto-viewport="true"

							></bm-driving>
				</baidu-map>
			</template>
		</el-dialog>
		</div>
	</section>
</template>

<script>
	export default {
		data() {
			return {
                toWay:'',
                returnCarMap:false,
			    //高级查询时传递的值
                filters:{
                    name:''
                },
                currentPage:1,
                total:0,
                sels: [],//列表选中列
                returnCar: {
                    address:''
				},
				listLoading: false,//如果为false，显示加载中效果，转圈圈
				editFormVisible: false,//编辑界面是否显示，false不显示

			}
		},
		methods: {
            getreturencar(row, column, event){
                this.toWay= row.address;
                this.returnCarMap=true;
			},
            handleCurrentChange(val){
                //当前页
                this.currentPage = val;
                this.getReturnCar();
            },
            //查询所有的部门
            getReturnCar(){
                //发送axios请求到后端 查询部门
                // http://localhost:80/department/list
                let param = {
                    custormer:this.filters.name,
                    currentPage: this.currentPage
                }
                this.$http.patch('/returnCar/queryPage',param).then(res =>{
                    //pageList {total:20,rows:[]}
                    this.total = res.data.total;
                    this.returnCar = res.data.rows;
                })
            },
            //多选方法
            selsChange: function (sels) {
                this.sels = sels;
            }
		},
		mounted() {

			this.getReturnCar();
		}
	}
</script>

<style scoped>
	.map{
		width: 100%;
		height: 600px;
	}

</style>